<template>
	<div class="main-wrapper search-wrapper">
		<!--<search v-model="searchValue"
		        @on-submit="search"
		        :auto-scroll-to-top="true"
		        :results="searchResult"></search>-->
		
		<search v-model="searchValue"
				@on-submit="search"
				style="z-index: 1000;"
				:auto-scroll-to-top="true"></search>
		<!--<img :src="sk"
		     alt="">-->
		<div class="timeline-demo">
			<timeline>
				<timeline-item v-for="(i, index) in reverseList" :key="index">
					<h4 :class="[index === 0 ? 'recent' : '']">{{i.AcceptStation}}</h4>
					<p :class="[index === 0 ? 'recent' : '']">{{i.AcceptTime}}</p>
				</timeline-item>
			</timeline>
		</div>
	</div>
</template>
<script>
import checkLogin from '../myUtils/checkLogin';
import { Search } from 'vux'
import { Timeline, TimelineItem } from 'vux'
import { mapGetters } from 'vuex';
var mockData = require('../data/expressData');
var jjsk = require('../assets/jjsk.png');
export default {
	data() {
		return {
			name: 'search.vue',
			searchValue: '',
			sk: jjsk,
			searchResult: [{
				title: 'hello',
				otherData: 2333
			}, {
				title: 'world',
				otherData: 34444
			},],
			expressData:mockData.default,
			reComein:false,
		}
	},
	methods: {
		search() {
			var self = this;
			self.searchValue = self.searchValue.split(' ').join('');
			// if(!self.searchValue.lenght){
			// 	self.$vux.toast.show({
			// 		type:'text',
			// 		text: '请输入物流单号！',
			// 		width:'auto',
			// 		position:'middle',
			// 	});
			// 	return;
			// }
			// http://wihcy.iok.la:33571/hlb/findkdinfo.do?kdno=80000205825824
			new Promise(function(resolve,reject){
				self.$http.get('http://wihcy.iok.la:33571/hlb/findkdinfo.do', {
					params: {
						kdno: self.searchValue || '80000205825824',
					},
					headers: {'Content-Type': 'application/json;charset=UTF-8'},
				}).then(function (res) {
					self.expressData = res.data;
					resolve(res)
				}).catch(function (err) {
					self.expressData = mockData.default,
					reject(err);
				});

			}).then(function(res){
				self.$http.get('http://wihcy.iok.la:33571/hlb/insertRecord.do',{
					params: {
						useguid: self.userInfo.username,
						kno:self.searchValue
					},
				});
			})
		}
	},
	components: {
		Search,Timeline, TimelineItem,
	},
	computed:{
		...mapGetters(['userInfo']),
		reverseList:function(){
			this.expressData.Traces.sort(function(v1,v2){
				var v1b = new Date(v1.AcceptTime).getTime();
				var v2b = new Date(v2.AcceptTime).getTime();
				if(v1b<v2b){
					return true;
				}else{
					return false;
				}
			});
			return this.expressData.Traces;
			// return this.expressData.Traces.reverse();
		}
	},
	created() {
		checkLogin(this);
	},
	mounted(){
		if(this.$route.params.kdno && this.$route.params.kdno!='false'){
			this.searchValue = this.$route.params.kdno;
			this.search();
		}
	}
}
</script>
<style scoped>
.search-wrapper {
	display: flex;
	flex-direction: column;
	/*justify-content: center;*/
	align-items: center;
}
.recent{
	color:#09BB07;
}
</style>
